<!DOCTYPE html>
<head>
	<meta charset="UTF-8">
	<title>SimpleCalendar</title>
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Lato:300,400,700">
	<link rel="stylesheet" href="http://weloveiconfonts.com/api/?family=fontawesome">
	<link rel="stylesheet" href="assets/css/style.css">
	<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
	<script src="assets/js/simplecalendar.js" type="text/javascript"></script>
</head>
<body>
	
	<div class="container">
		<div class="row">
			<div class="col-lg-12">
				<h1 class="page-header">jQuery.<small>Simple-Event-Calendar</small>
				</h1>
			</div>
		</div>
		<div class="row">
			<div class="col-md-6">
				<div class="calendar hidden-print">
					<header>
						<h2 class="month"></h2>
						<a class="btn-prev fontawesome-angle-left" href="#"></a>
						<a class="btn-next fontawesome-angle-right" href="#"></a>
					</header>
					<table>
						<thead>
							<tr><td>Mån</td><td>Tis</td><td>Ons</td><td>Tors</td><td>Fre</td><td>Lör</td><td>Sön</td></tr>
						</thead>
						<tbody>
							<tr>
								<td date-month="1" date-day="1">1</td>
								<td date-month="1" date-day="2">2</td>
								<td date-month="1" date-day="3">3</td>
								<td date-month="12" date-day="4">4</td>
								<td date-month="1" date-day="5">5</td>
								<td date-month="1" date-day="6">6</td>
								<td date-month="1" date-day="7">7</td>
							</tr>
							<tr>
								<td date-month="1" date-day="8">8</td>
								<td date-month="1" date-day="9">9</td>
								<td date-month="1" date-day="10">10</td>
								<td date-month="1" date-day="11">11</td>
								<td date-month="1" date-day="12">12</td>
								<td date-month="1" date-day="13">13</td>
								<td date-month="1" date-day="14">14</td>
							</tr>
							<tr>
								<td date-month="1" date-day="15">15</td>
								<td date-month="1" date-day="16">16</td>
								<td date-month="1" date-day="17">17</td>
								<td date-month="1" date-day="18">18</td>
								<td date-month="1" date-day="19">19</td>
								<td date-month="1" date-day="20">20</td>
								<td date-month="1" date-day="21">21</td>
							</tr>
							<tr>
								<td date-month="1" date-day="22">22</td>
								<td date-month="1" date-day="23">23</td>
								<td date-month="1" date-day="24">24</td>
								<td date-month="1" date-day="25">25</td>
								<td date-month="1" date-day="26">26</td>
								<td date-month="1" date-day="27">27</td>
								<td date-month="1" date-day="28">28</td>
							</tr>
							<tr>
								<td date-month="1" date-day="29">29</td>
								<td date-month="1" date-day="30">30</td>
								<td date-month="1" date-day="31">31</td>
								<td date-month="1" date-day="0">1</td>
								<td date-month="1" date-day="0">2</td>
								<td date-month="1" date-day="0">3</td>
								<td date-month="1" date-day="0">4</td>
							</tr>
						</tbody>
					</table>
					<div class="list">
						<div class="day-event" date-month="12" date-day="4" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 1</h2>
							<p class="date">2014-12-4</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="13" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 2</h2>
							<p class="date">2014-12-13</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="13" data-number="2">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 2</h2>
							<p class="date">2014-12-13</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="14" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 3</h2>
							<p class="date">2014-12-14</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="16" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 4</h2>
							<p class="date">2014-12-16</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="24" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 5</h2>
							<p class="date">2014-12-24</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
						<div class="day-event" date-month="12" date-day="31" data-number="1">
							<a href="#" class="close fontawesome-remove"></a>
							<h2 class="title">Lorem ipsum 6</h2>
							<p class="date">2014-12-31</p>
							<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra ett provexemplar av en bok.</p>
							<label class="check-btn">
								<input type="checkbox" class="save" id="save" name="" value=""/>
								<span>Save to personal list!</span>
							</label>
						</div>
					</div>
				</div>
			</div>
			<div class="col-md-6">
				<label class="print pull-right">
					<span class="print-btn hidden-print">Print your list!</span>
				</label>
				<h2>Personal list</h2>
				<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
				<div class="person-list"></div>
			</div>
		</div>
	</div>
</body>
</html>